<template>
	<view>
		<!-- 头部 -->
		 <uni-nav-bar background-color="#3286ed" :statusBar="true"  :fixed="true" color="#fff" title="回货入库详情" left-icon="left"
		  @clickLeft="backFn"></uni-nav-bar>    
		  
		  <view  class="application" >
				<view class="application_one">{{infoData.returnReceiptNo}}</view>
				<view class="application-desc">
					<view >发起人：{{infoData.sponsorName}}</view>
					<view >回货申请单：{{infoData.returnApplyNo}}</view>
					<view >入库日期：{{infoData.warehousingTime}}</view>
					<view >入库仓库：{{infoData.applyWarehouseName}}</view>
				</view>
				
		  </view>
		 <view class="Buttom">
		  	<view class="left">
		  		<uni-icons class="icon" size="24" color="#fd9540" type="person-filled"></uni-icons> 
		  		<span class="name">{{infoData.sponsorName}}</span>
		  	</view>
		  	<view class="left">
		  		<uni-icons class="icon" size="24" color="#55aaff" type="calendar-filled"></uni-icons>
		  		<span class="name" >{{infoData.customerName}}</span>
		  	</view>
		  </view>
		  <u-tabs :list="tablist" class="tabs" lineColor="#fd9540" lineWidth="85px"
		  		   			:activeStyle="{ color: '#fd9540', fontWeight: 'bold', transform: 'scale(1.05)'}"
		  		   			:current="index"   @change="index=$event.index" 
		  		   			>	
		  		   			</u-tabs>
							<u--form labelPosition="left" class='orderdetails' labelWi	  ref="form1">
								<view class="box" v-if="index*1===0">
									<u-cell>
										<template #title>
											<view style="color:#ccc" class="u-cell-text">基本信息</view>
										</template>
									</u-cell>
									<u-cell-group>
										<u-cell>
											<view  slot="title" class="u-slot-title">
												<text class="u-cell-text">租赁回货入库单号</text>
												<text class="u-cell-text_d">{{infoData.returnReceiptNo}}</text>
											</view>
										</u-cell>
										<u-cell>
											<view  slot="title" class="u-slot-title">
												<text class="u-cell-text">发起人</text>
												<text class="u-cell-text_d">{{infoData.sponsorName}}</text>
											</view>
										</u-cell>
										<u-cell>
											<view  slot="title" class="u-slot-title">
												<text class="u-cell-text">入库日期</text>
												<text class="u-cell-text_d">{{infoData.warehousingTime}}</text>
											</view>
										</u-cell>
										<u-cell>
											<view  slot="title" class="u-slot-title">
												<text class="u-cell-text">客户名</text>
												<text class="u-cell-text_d">{{infoData.customerName}}</text>
											</view>
										</u-cell>
										<u-cell>
											<view  slot="title" class="u-slot-title">
												<text class="u-cell-text">申请单编号</text>
												<text class="u-cell-text_d">{{infoData.returnApplyNo}}</text>
											</view>
										</u-cell>
										<u-cell>
											<view  slot="title" class="u-slot-title">
												<text class="u-cell-text">业务员</text>
												<text class="u-cell-text_d">{{infoData.salesmanName}}</text>
											</view>
										</u-cell>
										<u-cell>
											<view  slot="title" class="u-slot-title">
												<text class="u-cell-text">申请入库仓库</text>
												<text class="u-cell-text_d">{{infoData.applyWarehouseName}}</text>
											</view>
										</u-cell>
										<u-cell>
											<view  slot="title" class="u-slot-title">
												<text class="u-cell-text">入库仓库</text>
												<text class="u-cell-text_d">{{infoData.warehousingWarehouseName}}</text>
											</view>
										</u-cell>
										<!-- <u-cell>
											<view  slot="title" class="u-slot-title">
												<text class="u-cell-text">总价</text>
												<text class="u-cell-text_d">{{infoData.totalPrice}}</text>
											</view>
										</u-cell> -->
										<u-cell>
											<view  slot="title" class="u-slot-title">
												<text class="u-cell-text">备注</text>
												<text class="u-cell-text_d">{{infoData.remark}}</text>
											</view>
										</u-cell>
										<u-cell>
											<view  slot="title" class="u-slot-title">
												<text class="u-cell-text">创建时间</text>
												<text class="u-cell-text_d">{{infoData.createTime}}</text>
											</view>
										</u-cell>
										<u-cell>
											<view  slot="title" class="u-slot-title">
												<text class="u-cell-text">更新时间</text>
												<text class="u-cell-text_d">{{infoData.updateTime}}</text>
											</view>
										</u-cell>
									 
										</u-cell-group>
								</view>
								<view class="box" v-if="index*1===1">
									<u-cell>
										<template #title>
											<view style="color:#ccc" class="u-cell-text">入库产品</view>
										</template>
									</u-cell>
									<view>
										<uni-table border stripe emptyText="暂无更多数据" >
											<!-- 表头行 -->
											<uni-tr>
												<uni-th align="center">产品名称</uni-th>
												<uni-th align="center">产品编号</uni-th>
												<uni-th align="center">型号</uni-th>
												<uni-th align="center">机器编码</uni-th>
												<uni-th align="center">单位</uni-th>
												<uni-th align="center">仓库</uni-th>
												<uni-th align="center">备注</uni-th>
											</uni-tr>
											<!-- 表格数据行 -->
											<uni-tr v-for="(item,index) in productList" :key="index">
												<uni-td  align="center" >{{item.productName}}</uni-td>
												<uni-td  align="center" >{{item.productNo}}</uni-td>
												<uni-td  align="center" >{{item.model}}</uni-td>
												<uni-td  align="center" >{{item.machineNo}}</uni-td>
												<uni-td  align="center"  v-if="item.unit">台</uni-td>
												<uni-td  align="center" >{{item.warehouseName}}</uni-td>
												<uni-td  align="center" >{{item.remark}}</uni-td>
											</uni-tr>
											
										</uni-table>
									</view>
								</view>
								<view class="box" v-if="index*1===2">
									<u-cell>
										<template #title>
											<view style="color:#ccc" class="u-cell-text">审批流程</view>
										</template>
									</u-cell>
								</view>
								<view class="box" v-if="index*1===3">
									<u-cell>
										<template #title>
											<view style="color:#ccc" class="u-cell-text">审批历史</view>
										</template>
									</u-cell>
								</view>
							</u--form>
	</view>
</template>

<script>
	import {getBackwarehouseInfoApi} from '@/api/backwarehouse.js'
	export default {
		data() {
			return {
				infoData:{},
				tablist:[
					{name:'基本信息'},
					{name:'入库产品'},
					{name:'审批流程'},
					{name:'审批历史'},
				],
				index:0,
				productList:[]
			};
		},
		onLoad(e) {
			this.initData(e)
		},
		methods:{
			
			async initData(e){
				console.log(e);
				let res=await getBackwarehouseInfoApi(e.id)
				console.log(res);
				this.infoData=res.data
				this.productList=res.data.mechineList
			},
			
			
			
			// 返回上一级
				backFn(){
					 uni.navigateBack({delta:1})
				}
			},
		 
	}
</script>

<style lang="scss" scoped>
 .application{
		  background-color: #fff;
		  border-bottom: 1px solid #ccc;
		  padding-top: 10px;
		  padding-left: 15px;
		  padding-bottom: 10px;
		  .application_one{
			  font-size: 14px;
			  font-weight: 600;
		  }
		  .application-desc{
			  font-size: 12px;
			  view{
				  margin-top: 3px;
			  }
		  }
		  
	  }
	  .Buttom{
	  	 display: flex;
	  	 justify-content: space-between;
	     background-color: #fff;	
		 border-bottom: solid 1px #c3c3c3;
		 margin-bottom: 5px;
	   .left{
	  		width: 50%;
	  		height: 35px;
	  		line-height: 35px;
			margin-left: 10px;
	  	 
	  		.icon,.name{
	  		 vertical-align:middle;
	  		 }
	  		.name{
	  		  padding-left: 10px;
			  font-size: 12px;
	  		}
	  		 
	  		}
	  		.left{
	  			border-right: 1px solid #ccc;
	  		}
	  		
	  }
	  .tabs{
	  	background-color: #fff;
	  }
	  .orderdetails{
	  	background-color: #fff;
		.u-slot-title{
			display: flex;
			justify-content: space-between;
			
		}
		
	  }
	  
	  
</style>
